<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>洪湛和波波的爱情故事</title>
    <meta name="description" content="Wonderful Wedding Template built with Bootstrap Framework for creating Wedding Website"/>
    <link rel="apple-touch-icon" sizes="180x180" href="images/favicon/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="images/favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="images/favicon/favicon-16x16.png">
    <link href="css/2.css" rel="stylesheet">
    <link href="css/1.css" rel="stylesheet">
    <script defer src="js/all.js"></script>
    <link href="css/aos.css" rel="stylesheet">
    <link href="css/ekko-lightbox.css" rel="stylesheet">

      <link rel="stylesheet" href="styles/main.css" >
      <link rel="stylesheet" href="styles/style.css">

      <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="js/functions_dev.js"></script>
  </head>
  <body id="top">

    <header></header>

    <div class="page-content">
      <div class="div">
<div class="ww-home-page" id="home">

  <div class="ww-wedding-announcement d-flex align-items-center justify-content-start">

    <div class="container ww-announcement-container">
      <p class="ww-couple-name ww-title" data-aos="zoom-in-down" data-aos-delay="300" data-aos-duration="1000">HongZhan & BOBO</p>
        <!--img class="img-fluid mt-1" src="images/laurel-1.png" alt="Heart" data-aos="zoom-in-down" data-aos-delay="300" data-aos-duration="1000"/-->
        <div class="container">
            <div id="l-ball" class="ball">
                <div class="face face-l">
                    <div class="eye eye-l"></div>
                    <div class="eye eye-r"></div>
                    <div class="mouth"></div>
                </div>
            </div><div id="r-ball" class="ball">
            <div class="face face-r">
                <div class="eye eye-l eye-r-p"></div>
                <div class="eye eye-r eye-r-p"></div>
                <div class="mouth mouth-r"></div>
                <div class="kiss-m">
                    <div class="kiss"></div>
                    <div class="kiss"></div>
                </div>
            </div>
        </div>
        </div>
      <p class="h2 mt-5 ww-title" data-aos="zoom-in-down" data-aos-delay="300" data-aos-duration="1000" data-aos-offset="10">1<sup>th</sup> October, 2017</p>
    </div>
  </div>
</div>
<div class="ww-nav-bar sticky-top bg-light">
  <nav class="navbar navbar-expand-lg navbar-light">
    <div class="container"><a href="#"><svg class="heart" viewBox="0 0 32 29.6"><path d="M23.6,0c-3.4,0-6.3,2.7-7.6,5.6C14.7,2.7,11.8,0,8.4,0C3.8,0,0,3.8,0,8.4c0,9.4,9.5,11.9,16,21.2c6.1-9.3,16-12.1,16-21.2C32,3.8,28.2,0,23.6,0z"/>
</svg></a>
      <h1 class="h2"><a class="pl-4 navbar-brand" href="#">Days together</a></h1>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#ww-navbarNav" aria-controls="ww-navbarNav" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
      <div class="collapse navbar-collapse text-uppercase" id="ww-navbarNav">
        <ul class="navbar-nav ml-auto">
          <li class="nav-item"><a class="nav-link smooth-scroll" href="#home">Home</a></li>
          <li class="nav-item"><a class="nav-link smooth-scroll" href="#couple">Couple</a></li>
          <li class="nav-item"><a class="nav-link smooth-scroll" href="#events">Footprint</a></li>
          <!--li class="nav-item"><a class="nav-link smooth-scroll" href="#people">People</a></li-->
          <li class="nav-item"><a class="nav-link smooth-scroll" href="#gallery">Gallery</a></li>
          <li class="nav-item"><a class="nav-link smooth-scroll" href="#rsvp">Clock</a></li>
        </ul>
      </div>
    </div>
  </nav>
</div>
<div class="ww-section" id="couple">
  <div class="container">
      <h2 class="h1 text-center pb-3 ww-title" data-aos="zoom-in-down" data-aos-duration="1000"><img src="images/a2.gif"/>Boy & Girl</h2>
    <div class="row text-center">

      <div class="col-md-6">
        <div class="mt-3"><img class="img-fluid" src="images/groom.jpg" alt="Groom" data-aos="flip-left" data-aos-duration="1000"/>
          <p class="pt-3 text-left text-muted"></p>
          <h3 class="h2 ww-title">HongZhan</h3>
          <!--div class="ww-social-links"><a class="btn btn-link" href="#"><i class="fab fa-facebook-f" aria-hidden="true"></i></a><a class="btn btn-link" href="#"><i class="fab fa-twitter" aria-hidden="true"></i></a><a class="btn btn-link" href="#"><i class="fab fa-google-plus-g" aria-hidden="true"></i></a><a class="btn btn-link" href="#"><i class="fab fa-instagram" aria-hidden="true"></i></a></div-->
        </div>
      </div>


      <!--div class="col-md-6">
        <div class="mt-3">
            <video class="img-fluid" autoplay="autoplay" alt="Bride" controls="" data-aos="flip-right" data-aos-duration="1000">
                <source src="images/lv_6798644881884515599_20200302211717.mp4" type="video/mp4" />
            </video>
          <p class="pt-3 text-left text-muted"></p>
          <h3 class="h2 ww-title">BoBo</h3>
        </div>
      </div-->
        <div class="col-md-6">
            <div class="mt-3"><img class="img-fluid" src="images/bride.jpg" alt="Bride" data-aos="flip-right" data-aos-duration="1000"/>
                <p class="pt-3 text-left text-muted"></p>
                <h3 class="h2 ww-title">BoBo</h3>
                <!--div class="ww-social-links"><a class="btn btn-link" href="#"><i class="fab fa-facebook-f" aria-hidden="true"></i></a><a class="btn btn-link" href="#"><i class="fab fa-twitter" aria-hidden="true"></i></a><a class="btn btn-link" href="#"><i class="fab fa-google-plus-g" aria-hidden="true"></i></a><a class="btn btn-link" href="#"><i class="fab fa-instagram" aria-hidden="true"></i></a></div-->
            </div>
        </div>
    </div>
  </div>
</div>
<div class="ww-section bg-light" id="events">
  <div class="container ww-wedding-event">
    <h2 class="h1 text-center pb-3 ww-title" data-aos="zoom-in-down" data-aos-duration="1000">
        <img src="images/favicon/yier.gif"/>
        Footprint</h2>
    <div>
      <div class="col-md-12 text-center ww-category-filter mb-4">
        <a class="btn btn-outline-primary ww-filter-button" href="#">一高中的回忆</a>
        <a class="btn btn-outline-primary ww-filter-button" href="#">南京中山陵</a>
          <a class="btn btn-outline-primary ww-filter-button" href="#">2019年七夕</a>
          <a class="btn btn-outline-primary ww-filter-button" href="#">游泳馆</a>
          <a class="btn btn-outline-primary ww-filter-button" href="#">锦州</a>
          <a class="btn btn-outline-primary ww-filter-button" href="#">2020年情人节</a>

      </div>
    </div>
    <div class="row">
      <div class="col-md-7 col-sm-12">
        <div class="my-3">
          <div class="h4">一高中的回忆</div>
          <ul>
            <li><i class="text-muted fas fa-map-marker-alt"></i><span class="pl-2 text-muted">辽宁省 辽阳市 第一高级中学</span></li>
            <li class="pt-2"><i class="text-muted far fa-calendar-alt"></i><span class="pl-2 text-muted">20 Jan 2019, 9AM - 6PM</span></li>
          </ul>
          <p>我们俩毕业于辽阳市第一高级中学，这张照片是我们毕业一年后回一高中照的影子相，我们高中时并没有在一起，怕将来因为大学不同导致我俩异地分开。。但是我俩毕业后还是在一起了，度过了一个又一个异地的学期。两情若是久长时，又岂在朝朝暮暮。我们每个假期都过得很开心！</p>
          <p>其实大学生活也蛮累的。唉，高中的想法和大学的想法还是差了很多。</p>
        </div>
      </div>
      <div class="col-md-5 col-sm-12">
        <div class="my-3"><img class="img-fluid" src="images/wedding-party.jpg" alt="Wedding Party" data-aos="fade-down-right" data-aos-duration="1000"/></div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-7 col-sm-12">
        <div class="my-3">
          <div class="h4">南京中山陵</div>
          <ul>
            <li><i class="text-muted fas fa-map-marker-alt "></i><span class="pl-2 text-muted">江苏省 南京市 中山陵</span></li>
            <li class="pt-2"><i class="text-muted far fa-calendar-alt "></i><span class="pl-2 text-muted">29 Apr 2019, 11AM - 6PM</span></li>
          </ul>
          <p>这次是我俩一起去南京玩的日子，我们都期待了好久，我俩一起在南京玩，瞎溜达，吃了好多好吃的。一起爬小山坡，一起散步。欣赏周边的景色。</p>
          <p>然后晚上我们回酒店，一起看电影，一起吃小吃！玩的贼开心嘻嘻！</p>
          <p>然后波波来我的大学，我们一起在大学里面溜达，玩。还一起骑自行车，简直棒极了！</p>
        </div>
      </div>
      <div class="col-md-5 col-sm-12">
        <div class="my-3"><img class="img-fluid" src="images/reception.jpg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
      </div>
    </div>
      <div class="row">
          <div class="col-md-7 col-sm-12">
              <div class="my-3">
                  <div class="h4">游泳馆</div>
                  <ul>
                      <li><i class="text-muted fas fa-map-marker-alt "></i><span class="pl-2 text-muted">辽宁省 辽阳市 富虹国际酒店</span></li>
                      <li class="pt-2"><i class="text-muted far fa-calendar-alt "></i><span class="pl-2 text-muted">5 Aug 2019, 11AM - 6PM</span></li>
                  </ul>
                  <p>这天我俩一起去了游泳馆！由我，亲自教波波游泳！超级开心！</p>
                  <p>然后波波还，害怕雨太大回不去家。</p>
                  <p>怀念和波波在一起游泳的时候，波波离不开我的样子！嘻嘻！</p>
              </div>
          </div>
          <div class="col-md-5 col-sm-12">
              <div class="my-3"><img class="img-fluid" src="images/21494d6487562d83.jpg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
          </div>
      </div>
      <div class="row">
          <div class="col-md-7 col-sm-12">
              <div class="my-3">
                  <div class="h4">2019年七夕</div>
                  <ul>
                      <li><i class="text-muted fas fa-map-marker-alt "></i><span class="pl-2 text-muted">辽宁省 辽阳市 友谊商城</span></li>
                      <li class="pt-2"><i class="text-muted far fa-calendar-alt "></i><span class="pl-2 text-muted">7 Jul 2019, 7AM - 6PM</span></li>
                  </ul>
                  <p>又是七夕啦！我俩一起去看电影。</p>
                  <p>看完就到处溜溜达达~</p>
              </div>
          </div>
          <div class="col-md-5 col-sm-12">
              <div class="my-3"><img class="img-fluid" src="images/mmexport1580473938772.jpg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
          </div>
      </div>
      <div class="row">
          <div class="col-md-7 col-sm-12">
              <div class="my-3">
                  <div class="h4">锦州</div>
                  <ul>
                      <li><i class="text-muted fas fa-map-marker-alt "></i><span class="pl-2 text-muted">辽宁省 锦州市 锦州站</span></li>
                      <li class="pt-2"><i class="text-muted far fa-calendar-alt "></i><span class="pl-2 text-muted">5 Oct 2019, 11AM - 6PM</span></li>
                  </ul>
                  <p>国庆假期结束，我要上学的时候，我们在锦州呆了几天。</p>
                  <p>波波领我去凌河夜市吃了好多好吃的！我超级开心！尤其是那个那个，榴莲芝士饼！</p>
                  <p>期间我俩也到处瞎溜达，我还吃了小龙虾！！一堆美滋滋的小龙虾！</p>
              </div>
          </div>
          <div class="col-md-5 col-sm-12">
              <div class="my-3"><img class="img-fluid" src="images/1576514504661.jpeg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
              <div class="my-3"><img class="img-fluid" src="images/1574573616206.jpeg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
          </div>
      </div>
      <div class="row">
          <div class="col-md-7 col-sm-12">
              <div class="my-3">
                  <div class="h4">2020年情人节</div>
                  <ul>
                      <li><i class="text-muted fas fa-map-marker-alt "></i><span class="pl-2 text-muted">辽宁省 辽阳市</span></li>
                      <li class="pt-2"><i class="text-muted far fa-calendar-alt "></i><span class="pl-2 text-muted">14 Feb 2020, 11AM - 6PM</span></li>
                  </ul>
                  <p>最近疫情很严重，我俩也是半个多月没见面了，简直想的要死！！！</p>
                  <p>所以我俩偷偷摸摸的去约了个小会。还下雪了！</p>
                  <p>最爱波波了！我家波波越来越漂亮，嘻嘻！！</p>
              </div>
          </div>
          <div class="col-md-5 col-sm-12">
              <div class="my-3"><img class="img-fluid" src="images/497e956960f63333.jpg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
              <div class="my-3"><img class="img-fluid" src="images/5d4631947102ffa4.jpg" alt="Reception" data-aos="fade-up-right" data-aos-duration="1000"/></div>
          </div>
      </div>
  </div>
</div>
<div class="ww-section bg-light" id="gallery">
  <div class="ww-photo-gallery">
    <div class="container">
      <h2 class="h1 text-center pb-3 ww-title" data-aos="zoom-in-down" data-aos-duration="1000">Photo Gallery</h2>
      <div class="col-md-12 text-center ww-category-filter mb-4">
        <a class="btn btn-outline-primary ww-filter-button" href="#" data-filter="all">I</a>
        <a class="btn btn-outline-primary ww-filter-button" href="#" data-filter="vacation">Love</a>
        <a class="btn btn-outline-primary ww-filter-button" href="#" data-filter="party">You</a>
        <a class="btn btn-outline-primary ww-filter-button" href="#" data-filter="ceremony">My</a>
        <a class="btn btn-outline-primary ww-filter-button" href="#" data-filter="wedding">BoBo</a>
      </div>
      <div class="ww-gallery" data-aos="fade-zoom-in" data-aos-easing="ease-in-back" data-aos-delay="300" data-aos-duration="1000" data-aos-offset="0">
        <div class="card-columns">
          <div class="card" data-groups="[&quot;vacation&quot;,&quot;ceremony&quot;]">
            <a href="images/gallery-pic-1.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
              <img class="img-fluid" src="images/gallery-pic-1.jpg" alt="Gallery Pic 1"/>
            </a>
          </div>
          <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
            <a href="images/gallery-pic-2.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
              <img class="img-fluid" src="images/gallery-pic-2.jpg" alt="Gallery Pic 2"/>
            </a>
          </div>
          <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
            <a href="images/C018CB312D9EB8E1EE85CEEABB6BBAC4.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
              <img class="img-fluid" src="images/C018CB312D9EB8E1EE85CEEABB6BBAC4.jpg" alt="Gallery Pic 2"/>
            </a>
          </div>
          <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
            <a href="images/1694CBF665B32C4E4A2376D0AAA33BDE.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
              <img class="img-fluid" src="images/1694CBF665B32C4E4A2376D0AAA33BDE.jpg" alt="Gallery Pic 2"/>
            </a>
          </div>
          <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
            <a href="images/home-img1.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
              <img class="img-fluid" src="images/home-img1.jpg" alt="Gallery Pic 2"/>
            </a>
          </div>
          <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
            <a href="images/37FC8C9DB46C500DFDC25D91466CA86C.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
              <img class="img-fluid" src="images/37FC8C9DB46C500DFDC25D91466CA86C.jpg" alt="Gallery Pic 2"/>
            </a>
          </div>
          <div class="card" data-groups="[&quot;vacation&quot;]"><a href="images/1574573616206.jpeg" data-toggle="lightbox" data-gallery="ww-gallery"><img class="img-fluid" src="images/1574573616206.jpeg" alt="Gallery Pic 3"/></a></div>
          <div class="card" data-groups="[&quot;party&quot;,&quot;vacation&quot;]"><a href="images/1574573621691.jpeg" data-toggle="lightbox" data-gallery="ww-gallery"><img class="img-fluid" src="images/1574573621691.jpeg" alt="Gallery Pic 4"/></a></div>
          <div class="card" data-groups="[&quot;vacation&quot;]"><a href="images/1574573631550.jpeg" data-toggle="lightbox" data-gallery="ww-gallery"><img class="img-fluid" src="images/1574573631550.jpeg" alt="Gallery Pic 5"/></a></div>
          <div class="card" data-groups="[&quot;wedding&quot;,&quot;ceremony&quot;,&quot;party&quot;]"><a href="images/1574573656820.jpeg" data-toggle="lightbox" data-gallery="ww-gallery"><img class="img-fluid" src="images/1574573656820.jpeg" alt="Gallery Pic 6"/></a></div>
          <div class="card" data-groups="[&quot;vacation&quot;]"><a href="images/1574573660873.jpeg" data-toggle="lightbox" data-gallery="ww-gallery"><img class="img-fluid" src="images/1574573660873.jpeg" alt="Gallery Pic 7"/></a></div>
          <div class="card" data-groups="[&quot;wedding&quot;,&quot;party&quot;]"><a href="images/1574573674478.jpeg" data-toggle="lightbox" data-gallery="ww-gallery"><img class="img-fluid" src="images/1574573674478.jpeg" alt="Gallery Pic 8"/></a></div>
            <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
                <a href="images/-69a89ba09d897015.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
                    <img class="img-fluid" src="images/-69a89ba09d897015.jpg" alt="Gallery Pic 2"/>
                </a>
            </div>
            <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
                <a href="images/28b303903e88f620.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
                    <img class="img-fluid" src="images/28b303903e88f620.jpg" alt="Gallery Pic 2"/>
                </a>
            </div>
            <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
                <a href="images/Cache_518eec57020bd459..jpg" data-toggle="lightbox" data-gallery="ww-gallery">
                    <img class="img-fluid" src="images/Cache_518eec57020bd459..jpg" alt="Gallery Pic 2"/>
                </a>
            </div>
            <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
                <a href="images/Cache_19b86a9f45277cd1..jpg" data-toggle="lightbox" data-gallery="ww-gallery">
                    <img class="img-fluid" src="images/Cache_19b86a9f45277cd1..jpg" alt="Gallery Pic 2"/>
                </a>
            </div>
            <div class="card" data-groups="[&quot;party&quot;,&quot;wedding&quot;]">
                <a href="images/7e7c6ecf69f2f5bb.jpg" data-toggle="lightbox" data-gallery="ww-gallery">
                    <img class="img-fluid" src="images/7e7c6ecf69f2f5bb.jpg" alt="Gallery Pic 2"/>
                </a>
            </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="ww-section ww-rsvp-detail text-white" id="rsvp">
  <div class="container" data-aos="zoom-in-up" data-aos-duration="1000">
    <div class="col text-center">
        <img src="images/a1.gif"/>
        <h2 class="h1 ww-title pb-3" data-aos="zoom-in-down" data-aos-duration="1000">Clock</h2>
      <div id="loveHeart">
        <div id="words">
          <div id="messages">
            <div id="elapseClock"></div>
          </div>
          <div id="loveu">
            Love u forever and ever.<br/>
            <div class="signature">--from湛哥哥</div>
          </div>
        </div>
      </div>
      <script type="text/javascript">
    let together = new Date();
    together.setFullYear(2017, 9-1, 26);
    together.setHours(3);
    together.setMinutes(20);
    together.setSeconds(0);
    together.setMilliseconds(0);
      timeElapse(together);
      setInterval(function () {
        timeElapse(together);
      }, 500);
  </script>
    </div>

  </div>
</div>
<div class="ww-footer bg-light">
  <div class="container text-center py-4">
    Copyright © 2020 秃桔子
  </div>
</div></div>
    </div>
    <footer></footer>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/aos.js"></script>
    <script src="js/ekko-lightbox.min.js"></script>
    <script src="scripts/main.js"></script>
  </body>
</html>
